<template>
	<view class="recordPage">
		<u-sticky :offset-top="offsetTop" h5-nav-height="44">
			<u-tabs :list="list" :is-scroll="false" :current="current" @change="change" :bar-width="130"
			active-color="#002B56"></u-tabs>
		</u-sticky>
		
		<view class="record-list" v-if="dataList.length>0">
			<u-swipe-action :show="show" :index="index" 
						:btn-width="btnWidth"
						v-for="(item,index) in dataList" :key="index"
						@click="remove(item)"
						:options="options"
					>
				<view @click="mineCarDetail(item)" class="record-list-item">
					<view class="news-wrap" style="width: 640rpx; margin-left: 24rpx;">
						<view style="font-weight: bold;">{{ item.modelYear }}款 {{item.seriesName}}</view>
						<view style="color: #888888;font-size: 24rpx;margin-top: 12rpx;" v-if="item.valuationTime" class="news-wrap-desc">
						<view class="">
							{{ item.cityName }}
						</view>
						<view class="">
							{{ item.valuationTime | changeDates(0,7) }}上牌
						</view>
						<view class="">
							{{ item.mile }}万公里
						</view>

						</view>
						
						<view style="color: #888888;font-size: 24rpx;margin-top: 12rpx;" v-if="item.valuationTime" class="news-wrap-desc">
							<view class="">
								{{ item.fullyChargedEndurance }}公里
							</view>
						<view class="">
							<text class="zdj">估</text>
							{{ item.valuationInfo.goodPrice }}万
						</view>
						<view class="">
							{{ item.valuationTime }}
						</view>
						
						</view>
						
					</view>
				</view>
			</u-swipe-action>
			<uni-load-more :status="status" :icon-size="16" :content-text="contentText" />
		</view>
		<null :iconSize="160" :textSize="28" v-else></null>
	</view>
</template>

<script>
	import API from "@/api/morePage.js"
	export default {
		data() {
			return {
				list: [{
						name: '快速估值'
					},
					{
						name: '精准定价'
					},
				],
				current: 0,
				isTop: false,
				https: getApp().globalData.picturePath,
				dataList: [],
				parms:{
					page: 1,
					limit: 10
				},
				disabled: false,
				btnWidth: 240,
				show: false,
				options: [
					{
						text: '删除',
						style: {
							backgroundColor: '#dd524d'
						}
					}
				],
				status: 'more',
				isMore: true,
				contentText: {
					contentdown: '上拉加载更多',
					contentrefresh: '加载中',
					contentnomore: '--没有更多了--'
				}
			}
		},
		onShow() {
			this.getKsRecord()
		},
		onReachBottom() {
			this.parms.page++
			this.isTop = true
			this.status = 'loading'
			if(this.current == 0){
				if(this.isMore == true){
					this.getKsRecord()
				}
			}else{
				if(this.isMore == true){
					this.getJzRecord()
				}
			}
		},
		methods: {
			mineCarDetail(item){
				if(this.current == 0){
					uni.navigateTo({
						url:`/pagesA/assessment/mianfeiReportDetail?data=${encodeURIComponent(JSON.stringify(item))}`
					})
				}else{
					uni.navigateTo({
						url:`/pagesA/assessment/jingzhunReportDetail?data=${encodeURIComponent(JSON.stringify(item))}`
					})
				}
			},
			remove(item) {
				console.log(item)
				if(this.current == 0){
					this.getKsRecordRemove(item.bvId)
				}else{
					this.getJzRecordRemove(item.bvId)
				}
			},
			change(index) {
				this.current = index;
				this.isMore = true;
				this.status = 'more';
				this.isTop = false;
				this.parms = {
					page: 1,
					limit: 10
				}
				if(this.current == 0){
					this.getKsRecord()
				}else{
					this.getJzRecord()
				}
			},
			getKsRecordRemove(id){
				API.getKsRecordRemove({bvIds:id}).then(res=>{
					this.dataList = this.dataList.filter(item=>item.bvId != id)
					this.show = false
				})
			},
			getJzRecordRemove(id){
				API.getJzRecordRemove({accurateValuationId:id}).then(res=>{
					this.dataList = this.dataList.filter(item=>item.bvId != id)
					this.show = false
				})
			},
			getKsRecord(){
				API.getKsRecordList(this.parms).then(res=>{
					if(res.data.length<10){
						this.status = 'noMore'
						this.isMore = false
					}else{
						this.status = 'more'
					}
					if(this.isTop == false){
						this.dataList = res.data
					}else{
						if(res.data.length>0){
							res.data.map(item=>this.dataList.push(item))
						}
					}
					
				})
			},
			getJzRecord(){
				API.getJzRecordList(this.parms).then(res=>{
					console.log(res)
					if(res.data.length<10){
						this.status = 'noMore'
						this.isMore = false
					}else{
						this.status = 'more'
					}
					if(this.isTop == false){
						this.dataList = res.data
					}else{
						if(res.data.length>0){
							res.data.map(item=>this.dataList.push(item))
						}
					}
				})
			}
		}
	}
</script>

<style scoped lang="scss">
	.recordPage{
		background: #fff;
	}
	.record-list{
		padding: 0rpx 0rpx 24rpx;
		box-sizing: border-box;
		background-color: #fff;
		.record-list-item{
			padding: 24rpx 0rpx;
			margin-left: 24rpx;
			box-sizing: border-box;
			border-bottom: 2rpx solid #eee;
		}
	}
	.deleat{
		margin-left: 30rpx;
	}
	.newsTip {
		background: #F4E5C3;
		display: inline-block;
		padding: 0 8rpx;
		margin-right: 8rpx;
		font-size: 22rpx;
		border-radius: 10rpx;
	}
	
	.dataList {
		margin-top: 10px;
		border-bottom: 1px solid #dbdbdb;
		padding-bottom: 10rpx;
		margin-top: 20rpx;
	}
	.addCar{
		position: fixed;
		bottom: 0px;
		width: 100%;
		height: 80rpx;
		line-height: 80rpx;
		color: #fff;
		text-align: center;
		background-color: #002A55;
	}
	.news-wrap-desc{ 
		display:flex;
		justify-content:space-between;
		 }
		 
		 text.zdj{
			 width: 40rpx;
			 height: 40rpx;
			 border-radius: 20rpx;
			 background:  #002A55;
			 color: #fff;
			 display:inline-block;
			 margin-right: 6rpx;
			 text-align: center;
			 line-height: 40rpx;
		
		 }
</style>